{extend name="common/base_page" /}

{block name="title"}参数设置{/block}

{block name="jscssfile"}{/block}

{block name="css"}
<style type="text/css">
body,html{ background: #ffffff; }
.layui-fluid {
    padding:10px 15px;
}
.layui-nav-tree { width: 100%; };
.layui-card { box-shadow: rgb(255 255 255 / 0%) 0px 0px 0px 0px; box-shadow: 0 0px 0px #ccc;}
.layui-nav { background:#ccc; color:#000000;}
.layui-nav-tree .layui-nav-item a{ color:#000000; }
.layui-nav-tree .layui-this, .layui-nav-tree .layui-this>a, .layui-nav-tree .layui-nav-child dd.layui-this, .layui-nav-tree .layui-nav-child dd.layui-this a {
    background:rgba(0,0,0,.1)!important;color:#ffffff;
}
.layui-nav-itemed>.layui-nav-child {
    background-color: rgba(0,0,0,.1)!important;
}
.layui-form-item .layui-inline {
     margin-bottom: 0px;
    margin-right: 0px;
}
.foot-btn{
  border-top:1px solid #e6e5e1;
  background: #ffffff;
  text-align: center;
  width:100%;
  padding:15px 0;
}
</style>
{/block}

{block name="body"}
<div class="layui-fluid">
    <div class="layui-row" style="height:100vh;padding:0;">
        <!--left begin-->
        <div class="layui-col-md2">
            <div class="layui-card">
                <div class="layadmin-text">
                  <blockquote class="layui-elem-quote">
                    参数类型
                  </blockquote>
                </div>
                <ul class="layui-nav layui-nav-tree layui-inline mydictlist" lay-filter="component-nav-active" style="margin-right: 10px;">
                    {volist name="sz_cate_list" id="vo"}
                    <li class="layui-nav-item">
                      <a href="javascript:;" data-idx="{$vo.id}">{$vo.name}</a>
                    </li>
                    {/volist}
                </ul>
            </div>
        </div>
        <!--left end-->

        <!--right begin-->
        <div class="layui-col-md10" style="padding-left:10px;position: relative;">
            <div class="layui-card" style="height:100vh;">
                <div style="height:90%;overflow-y: scroll;">
                <form class="layui-form" id="config_form" onsubmit="return false;">
                  <table class="layui-table" style="margin-top:0px;">
                      <colgroup>
                        <col width="70">
                        <col width="200">
                        <col width="400">
                        <col>
                      </colgroup>
                      <thead>
                        <tr>
                          <th style="text-align: center;">序号</th>
                          <th>参数名称</th>
                          <th>参数值</th>
                          <th>参数说明</th>
                        </tr> 
                      </thead>
                      <tbody id="cfgBody">

                      </tbody>
                  </table>
                </form>
                  </div>

                  <div class="foot-btn">
                    <a class="layui-btn layui-btn-normal" onclick="_saveAction();">保存设置</a>
                  </div>

            </div>
        </div>
        <!--right end-->
    </div>
</div>
{/block}

{block name="script"}
<script type="text/javascript">
var _p = 1, _isFirst = true, _dictType = 'ALL',_inputName = '';
$(function(){
  $('.mydictlist li').children('a').click(function(){
      var _tmpType = $(this).data('idx');
      if(_tmpType != _dictType || _isFirst)
      {
          $(this).parent().addClass('layui-this');
          $(this).parent().siblings().removeClass('layui-this');
          if(_isFirst) _isFirst = false;
          _dictType = _tmpType;
          _p = 1;
          _loadList();
      }
  });
  setTimeout(function(){
    $('.mydictlist li:first').children('a').trigger('click');
  },50);
});
//加载数据
function _loadList()
{
  setLoadHtml(); //设置加载的tbody html
  _Index.ajax("{:url('index/base.config/index')}",{dicttype:_dictType},function(d){
      if(d.err == 0)
      {
        if(d.list.length <= 0)
        {
            setLoadHtml('暂未提供配置参数'); //设置加载的tbody html
            layer.msg('暂未提供配置参数', {time: 2000,anim: 4});
            return false;
        }
        var _html = '';
        $.each(d.list,function(t,v){
            _html += '<tr>\
              <td style="text-align: center;">'+parseInt(t+1)+'</td>\
              <td>'+v.title+'</td>\
              <td>' + getSetHtml(v) + '</td>\
              <td>'+v.tip+'</td>\
            </tr>';
        });
        $('#cfgBody').empty().append(_html);
        layform.render();
      }else{
        layer.msg(d.msg, {time: 2000,anim: 4});
      }
  },'请稍候...');
}
//保存设置
function _saveAction()
{
    var _list = _Index.getFormJson('#config_form');
    if(Object.keys(_list).length <= 0)
    {
      layer.msg('配置参数更新成功', {time: 2000});
      return false;
    }
    _Index.ajax("{:url('index/base.config/save')}",{list:_list,dicttype:_dictType},function(d){
        if(d.err == 0)
        {
          layer.msg(d.msg, {time: 1000},function(){ });
        }else{
          layer.msg(d.msg, {time: 2000,anim: 4});
        }
    },'请稍候...');
}
//设置加载的tbody html
function setLoadHtml(_txt)
{
  _txt = _txt || '请稍候...';
  $('#cfgBody').empty().append('<tr><td colspan="20" style="text-align: center;font-size:15px;">'+_txt+'</td></tr>');
}
//生成html
function getSetHtml(v)
{
  var _html = '<input type="text" name="'+v.name+'" value="'+v.value+'" placeholder="'+v.title+'" autocomplete="off" class="layui-input">';
  if(v.type == 'radio')
  {
      _html = '';
      $.each(v.listarr,function(t,va){
        var _checked = '';
        if(v.value == va.val) _checked = 'checked';
        _html += '<input type="radio" name="'+v.name+'" value="'+va.val+'" title="'+va.name+'" '+_checked+'>';
      });
  }else if(v.type == 'select'){
      _html = '<select name="'+v.name+'">';
      $.each(v.listarr,function(t,va){
        var _checked = '';
        if(v.value == va.val) _checked = 'selected';
        _html += '<option value="'+va.val+'" '+_checked+'>'+va.name+'</option>';
      });
      _html += '</select>';
  }else if(v.type == 'textarea'){
      _html = '<textarea name="'+v.name+'" placeholder="'+v.title+'" class="layui-textarea" autocomplete="off">'+v.value+'</textarea>';
  }else if(v.type == 'file'){
      _html = '<input type="hidden" name="'+v.name+'" value="'+v.value+'" placeholder="'+v.title+'" autocomplete="off" class="layui-input">';
      _html += '<a class="layui-btn layui-btn-primary layui-btn-sm" href="javascript:viewImg(\''+v.name+'\');">查看</a>';
      _html += '<a class="layui-btn layui-btn-sm layui-btn-normal" href="javascript:;" onclick="_inputName = \''+v.name+'\';_Index.attachment(0);">上传</a>';
  }
  return _html;
}
//附件选择后回调
function selectAttachmentFun(_list)
{
  $(".layui-form :input[name='"+_inputName+"']").val(_list);
  layer.close(_dialogLayer);
}
//查看图片
function viewImg(_tag)
{
  _tag = _tag || '';
  if(_tag == '')
  {
      layer.msg('请先上传', {time: 2000,anim: 4});
      return false;
  }
  var _imgUrl = $.trim($(".layui-form :input[name='"+_tag+"']").val());
  if(_imgUrl == '' || _imgUrl.length <= 0)
  {
      layer.msg('请先上传图片', {time: 2000,anim: 4});
      return false;
  }
  layer.open({
    type: 1,
    title:'查看文件',
    area: ['500px', '600px'],
    shade:[0.4,'#000000'],
    anim: 5,
    shadeClose: true,
    content: '<div style="width: 100%;height:100%;text-align: center;"><img src="'+_imgUrl+'" onerror="__imgErr();" style="width: 100%;height:auto;"/></div>'
  });
}
</script>
{/block}